import React from 'react';
import { GroupColumn } from '@/components/popovercolumn';
import { Fixed } from 'gantd/lib/grid';
import { getOrgColumnFilter, getUserColumnFilter } from '@/utils/utils';
import { getCodeLocaleName } from '@/utils/codelist';
import UserColumn from '@/components/popovercolumn/usercolumn';
import { Icon, Tooltip } from 'antd';

const searchFormschema = {
  userLoginName: {
    title: tr('账号'),
  },
  userName: {
    title: tr('用户名'),
  },
  organizationId: {
    title: tr('所属组织'),
    componentType: 'GroupSelector',
  },
  userType: {
    title: tr('用户类型'),
    componentType: 'CodeList',
    props: { type: 'FW_USER_TYPE' },
  },
};

const columns = [
  {
    title: tr('账号'),
    fieldName: 'userLoginName',
    fixed: Fixed.left,
    width: 100,
  },
  {
    title: tr('用户名'),
    fieldName: 'userName',
    fixed: Fixed.left,
    width: 120,
  },
  {
    title: tr('所属组织'),
    fieldName: 'organizationId',
    width: 150,
    render: (text: string) => <GroupColumn id={text} />,
    ...getOrgColumnFilter('organizationId'),
  },
  {
    title: tr('用户类型'),
    fieldName: 'userType',
    width: 100,
    filterValueGetter: (params: any) => getCodeLocaleName('FW_USER_TYPE', _.get(params, 'data.userType')),
  },
  {
    title: tr('职务说明'),
    fieldName: 'position',
    width: 100,
  },
  {
    title: tr('工号'),
    fieldName: 'staffNumber',
    width: 100,
  },
  {
    title: tr('性别'),
    fieldName: 'gender',
    width: 80,
    valueFormatter: ({ value }: any) => {
      if (!value) return;
      return getCodeLocaleName(MAIN_CONFIG.genderCodeType, value);
    },
    filterValueGetter: (params: any) => {
      const value = _.get(params, 'data.gender');
      if (!value) return;
      return getCodeLocaleName(MAIN_CONFIG.genderCodeType, value);
    },
  },
  {
    title: tr('移动电话'),
    fieldName: 'mobil',
    width: 100,
  },
  {
    title: tr('固定电话'),
    fieldName: 'telephone',
    width: 100,
  },
  {
    title: tr('传真'),
    fieldName: 'fax',
    width: 100,
  },
  {
    title: tr('邮箱'),
    fieldName: 'email',
    width: 120,
  },
];

const searchUISchema = {
  'ui:col': 6,
  'ui:labelCol': {},
  'ui:wrapperCol': {},
};

const usertableSchema = [
  {
    fieldName: 'name',
    title: tr('目录名称'),
    cellRenderer: 'gantGroupCellRenderer',
    width: 200,
  },
];

const alluserSchema = [
  {
    fieldName: 'userLoginName',
    title: tr('用户名'),
    width: 120,
    render: (text: string, record: any) => text && <UserColumn {...record} />,
    ...getUserColumnFilter('userLoginName'),
  },
  {
    fieldName: 'userLoginName',
    title: tr('账号'),
    width: 120,
  },
  {
    title: tr('所属组织'),
    fieldName: 'organizationId',
    width: 120,
    render: (text: string) => <GroupColumn id={text} />,
    ...getOrgColumnFilter('organizationId'),
  },
  {
    fieldName: 'email',
    title: tr('邮箱'),
    width: 150,
  },
];

const alluserSearchSchema = [
  {
    fieldName: 'userLoginName',
    title: tr('用户名'),
    width: 200,
    render: (text: string, record: any) => text && <UserColumn {...record} />,
    ...getUserColumnFilter('userLoginName'),
  },
  {
    fieldName: 'userLoginName',
    title: tr('账号'),
    width: 120,
  },
  {
    title: tr('所属组织'),
    fieldName: 'organizationId',
    width: 120,
    render: (text: string) => <GroupColumn id={text} />,
    ...getOrgColumnFilter('organizationId'),
  },
  {
    fieldName: 'email',
    title: tr('邮箱'),
    width: 150,
  },
];

const transferSearchSchema = {
  type: 'object',
  propertyType: {
    userLoginName: {
      title: (
        <>
          {tr('登录名')}
          <Tooltip title={'可接收excel复制的值'} zIndex={1300}>
            <Icon
              type="question-circle"
              style={{
                display: 'inline-block',
                color: 'orange',
                width: '15px',
                height: '24px',
                fontSize: '12px',
                lineHeight: '27px',
              }}
            />
          </Tooltip>
        </>
      ),
      componentType: 'ExcelSelect',
    },
  },
};

export {
  searchFormschema,
  columns,
  searchUISchema,
  usertableSchema,
  alluserSearchSchema,
  alluserSchema,
  transferSearchSchema,
};
